"use strict";
const uni_modules_uniTransition_components_uniTransition_createAnimation = require("./createAnimation.js");
const common_vendor = require("../../../../common/vendor.js");
const _sfc_main = {
    name: "uniTransition",
    emits: ["click", "change"],
    props: {
        show: {
            type: Boolean,
            default: false
        },
        modeClass: {
            type: [Array, String],
            default() {
                return "fade";
            }
        },
        duration: {
            type: Number,
            default: 300
        },
        styles: {
            type: Object,
            default() {
                return {};
            }
        },
        customClass: {
            type: String,
            default: ""
        }
    },
    data() {
        return {
            isShow: false,
            transform: "",
            opacity: 1,
            animationData: {},
            durationTime: 300,
            config: {}
        };
    },
    watch: {
        show: {
            handler(newVal) {
                if (newVal) {
                    this.open();
                } else {
                    if (this.isShow) {
                        this.close();
                    }
                }
            },
            immediate: true
        }
    },
    computed: {
        // 生成样式数据
        stylesObject() {
            let styles = {
                ...this.styles,
                "transition-duration": this.duration / 1e3 + "s"
            };
            let transform = "";
            for (let i in styles) {
                let line = this.toLine(i);
                transform += line + ":" + styles[i] + ";";
            }
            return transform;
        },
        // 初始化动画条件
        transformStyles() {
            return "transform:" + this.transform + ";opacity:" + this.opacity + ";" + this.stylesObject;
        }
    },
    created() {
        this.config = {
            duration: this.duration,
            timingFunction: "ease",
            transformOrigin: "50% 50%",
            delay: 0
        };
        this.durationTime = this.duration;
    },
    methods: {
        /**
         *  ref 触发 初始化动画
         */
        init(obj = {}) {
            if (obj.duration) {
                this.durationTime = obj.duration;
            }
            this.animation = uni_modules_uniTransition_components_uniTransition_createAnimation.createAnimation(Object.assign(this.config, obj), this);
        },
        /**
         * 点击组件触发回调
         */
        onClick() {
            this.$emit("click", {
                detail: this.isShow
            });
        },
        /**
         * ref 触发 动画分组
         * @param {Object} obj
         */
        step(obj, config = {}) {
            if (!this.animation)
                return;
            for (let i in obj) {
                try {
                    if (typeof obj[i] === "object") {
                        this.animation[i](...obj[i]);
                    } else {
                        this.animation[i](obj[i]);
                    }
                } catch (e) {
                    console.error(`方法 ${i} 不存在`);
                }
            }
            this.animation.step(config);
            return this;
        },
        /**
         *  ref 触发 执行动画
         */
        run(fn) {
            if (!this.animation)
                return;
            this.animation.run(fn);
        },
        // 开始过度动画
        open() {
            clearTimeout(this.timer);
            this.transform = "";
            this.isShow = true;
            let {opacity, transform} = this.styleInit(false);
            if (typeof opacity !== "undefined") {
                this.opacity = opacity;
            }
            this.transform = transform;
            this.$nextTick(() => {
                this.timer = setTimeout(() => {
                    this.animation = uni_modules_uniTransition_components_uniTransition_createAnimation.createAnimation(this.config, this);
                    this.tranfromInit(false).step();
                    this.animation.run();
                    this.$emit("change", {
                        detail: this.isShow
                    });
                }, 20);
            });
        },
        // 关闭过度动画
        close(type) {
            if (!this.animation)
                return;
            this.tranfromInit(true).step().run(() => {
                this.isShow = false;
                this.animationData = null;
                this.animation = null;
                let {opacity, transform} = this.styleInit(false);
                this.opacity = opacity || 1;
                this.transform = transform;
                this.$emit("change", {
                    detail: this.isShow
                });
            });
        },
        // 处理动画开始前的默认样式
        styleInit(type) {
            let styles = {
                transform: ""
            };
            let buildStyle = (type2, mode) => {
                if (mode === "fade") {
                    styles.opacity = this.animationType(type2)[mode];
                } else {
                    styles.transform += this.animationType(type2)[mode] + " ";
                }
            };
            if (typeof this.modeClass === "string") {
                buildStyle(type, this.modeClass);
            } else {
                this.modeClass.forEach((mode) => {
                    buildStyle(type, mode);
                });
            }
            return styles;
        },
        // 处理内置组合动画
        tranfromInit(type) {
            let buildTranfrom = (type2, mode) => {
                let aniNum = null;
                if (mode === "fade") {
                    aniNum = type2 ? 0 : 1;
                } else {
                    aniNum = type2 ? "-100%" : "0";
                    if (mode === "zoom-in") {
                        aniNum = type2 ? 0.8 : 1;
                    }
                    if (mode === "zoom-out") {
                        aniNum = type2 ? 1.2 : 1;
                    }
                    if (mode === "slide-right") {
                        aniNum = type2 ? "100%" : "0";
                    }
                    if (mode === "slide-bottom") {
                        aniNum = type2 ? "100%" : "0";
                    }
                }
                this.animation[this.animationMode()[mode]](aniNum);
            };
            if (typeof this.modeClass === "string") {
                buildTranfrom(type, this.modeClass);
            } else {
                this.modeClass.forEach((mode) => {
                    buildTranfrom(type, mode);
                });
            }
            return this.animation;
        },
        animationType(type) {
            return {
                fade: type ? 1 : 0,
                "slide-top": `translateY(${type ? "0" : "-100%"})`,
                "slide-right": `translateX(${type ? "0" : "100%"})`,
                "slide-bottom": `translateY(${type ? "0" : "100%"})`,
                "slide-left": `translateX(${type ? "0" : "-100%"})`,
                "zoom-in": `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
                "zoom-out": `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
            };
        },
        // 内置动画类型与实际动画对应字典
        animationMode() {
            return {
                fade: "opacity",
                "slide-top": "translateY",
                "slide-right": "translateX",
                "slide-bottom": "translateY",
                "slide-left": "translateX",
                "zoom-in": "scale",
                "zoom-out": "scale"
            };
        },
        // 驼峰转中横线
        toLine(name) {
            return name.replace(/([A-Z])/g, "-$1").toLowerCase();
        }
    }
};

function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
    return common_vendor.e({
        a: $data.isShow
    }, $data.isShow ? {
        b: $data.animationData,
        c: common_vendor.n($props.customClass),
        d: common_vendor.s($options.transformStyles),
        e: common_vendor.o((...args) => $options.onClick && $options.onClick(...args))
    } : {});
}

const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:/bj0517听书/配套资料/07-前端代码/ListenToBooks-master/uni_modules/uni-transition/components/uni-transition/uni-transition.vue"]]);
wx.createComponent(Component);
